<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/static/css/layui.css">
</head>
<body>
<div style="width: 1000px;height: 2000px;margin: 20px auto">
    <table lay-filter="demo">
        <thead>
        <tr>
            <th lay-data="{field:'ID'}">工号</th>
            <th lay-data="{field:'name'}">姓名</th>
            <th lay-data="{field:'email'}">邮箱</th>
            <th lay-data="{field:'option'}">操作</th>
        </tr>
        </thead>
        <tbody>
        {% for teacher in teachers %}
        <tr>
            <td>{{ teacher.ID }}</td>
            <td>{{ teacher.name }}</td>
            <td>{{ teacher.email }}</td>
            <td>
                <a href="/edit/{{ teacher.name }}" class="layui-btn layui-btn-sm">修改</a>
                <a href="/delete/{{ teacher.name }}" class="layui-btn layui-btn-sm layui-btn-danger">删除</a>
            </td>
        </tr>
        {% endfor %}
        </tbody>
    </table>
    <a href="/add" class="layui-btn">增加</a>
</div>


<script src="/static/layui.js"></script>
<script>
    //Demo

    layui.use('form', function () {
        var table = layui.table;

//转换静态表格
        table.init('demo', {
            height: 315 //设置高度,
            ,escape:false
            , limit: 100 //注意：请务必确保 limit 参数（默认：10）是与你服务端限定的数据条数一致
            //支持所有基础参数
        });
    });

</script>
</body>
</html>